import * as PageServices from '../../services/Editor/page';
import * as PagesServices from '../../services/Editor/pages';
import * as PageTimelinesServices from '../../services/Editor/pageTimelines';
import * as WidgetsServices from '../../services/Editor/widgets';
import * as TimelinesServices from '../../services/Editor/timelines';

export default {
    namespace: 'pages',
    state: [],
    reducers: {
        save(state, { payload: pages }) {
            return [...pages];
        },
        updatePage(oldPages, { payload: page }) {
            const sPages = oldPages.filter(w => w.page_id === page.page_id);
            if (sPages.length > 0) {
                const sIndex = oldPages.indexOf(sPages[0]);
                const tPage = { ...sPages[0], ...page };
                oldPages[sIndex] = tPage;
            }
            return [...oldPages];
        },
    },
    effects: {
        /**
         * 获取所有的页
         */
        *fetchPages({ payload: query }, { call, put, select }) {
            const oldPages = yield select(state => state.pages);
            const outOfDate = yield select(state => state.data.outOfDate);
            // 已经加载了且未过期，就继续加载数据
            if (oldPages.length > 0 && !outOfDate) {
                yield put({ type: 'selectPage' });
                return;
            }
            const { data: pages } = yield call(PagesServices.fetch, query);
            for (let i = 0; i < pages.length; i++) {
                pages[i].color = (i + 1);
            }
            yield put({ type: 'save', payload: pages });
            yield put({ type: 'widgets/clear' });
            yield put({ type: 'timelines/clear' });
            yield put({ type: 'selectPage' });
        },
        /**
         * 选中一页，或者默认选中第一页
         * 如果页的数据已经加载成功，就直接从本地读取
         * 如果页的数据未获取，获取页下所有的组件和动效
         */
        *selectPage({ payload: query }, { call, put, select }) {
            const pages = yield select(state => state.pages);
            const page = !query && pages.length > 0 ? pages[0] : query;
            if (!page.fetched) {
                // 获取页下的pageTimelines
                const { data: pageTimelines } = yield call(PageTimelinesServices.fetch, page.page_id);
                yield put({
                    type: 'pageTimelines/addTimelinesOfPage',
                    payload: pageTimelines,
                });
                // 获取页下所有组件
                const { data: pWidgets } = yield call(WidgetsServices.fetch, page.page_id);
                // 解决widgets无page_id widget_id的问题
                pWidgets.forEach((w) => {
                    w.page_id = page.page_id;
                    w.widget_id = w.id;
                });
                yield put({
                    type: 'widgets/addWidgetsOfPage',
                    payload: pWidgets,
                });
                // 获取页下所有动效
                for (let i = 0; i < pWidgets.length; i++) {
                    const { data: pTimelines } = yield call(TimelinesServices.fetch, pWidgets[i].widget_id);
                    // 解决timelines无page_id timeline_id的问题
                    pTimelines.forEach((t) => {
                        t.page_id = page.page_id;
                        t.timeline_id = t.id;
                    });
                    yield put({
                        type: 'timelines/addTimelinesOfPage',
                        payload: pTimelines,
                    });
                }
            }

            page.fetched = true;
            yield put({
                type: 'updatePage',
                payload: page,
            });
            yield put({ type: 'editor/setState',
                payload: {
                    selectedWidgetId: null,
                    selectedWidget: null,
                    selectedWidgetIds: [],
                    selectedWidgets: [],
                    selectedPageId: page.page_id,
                    selectedPage: page,
                    focusTab: 'page',
                },
            });
        },
        /**
         * 添加一页
         */
        *addPage(action, { call, put, select }) {
            const { data: page } = yield call(PagesServices.create, {});
            const pages = yield select(state => state.pages);
            if (pages.length >= 10) return; // 这里需要发消息给页面，提示给用户，暂未实现
            page.color = pages.length + 1;
            page.title = pages.length + 1;
            pages.push(page);
            yield put({
                type: 'save',
                payload: pages,
            });
            yield put({
                type: 'selectPage',
                payload: page,
            });
        },
    /**
     * 删除一页
     */
        *removePage({ payload: page }, { call, put, select }) {
            const pageId = page.page_id;
            yield call(PageServices.remove, page.page_id);
            const pages = yield select(state => state.pages);
            const tPages = pages.filter(p => p.page_id === pageId);
            if (tPages.length > 0) {
                const index = pages.indexOf(tPages[0]);
                pages.splice(index, 1);
                // 重新刷新标题
                for (let i = 0; i < pages.length; i++) {
                    pages[i].title = i + 1;
                }
                yield put({
                    type: 'save',
                    payload: pages,
                });
                yield put({
                    type: 'selectPage',
                    payload: pages[0],
                });
            }
        },
    },
    subscriptions: {
    },
};
